<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html 
	  xml:lang="es" lang="es"
	  xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">

	<ui:composition>
		<rich:panel>
		<h:outputLabel style="width:200px" for="it_filtroContacto" value="Filtro de busqueda " />
		<h:inputText id="it_filtroContacto" value="#{LibretaDirecciones.filtro}" styleClass="izquierda">
			<a4j:support event="onkeyup" reRender="dg_contactos" actionListener="#{LibretaDirecciones.reiniciaBusqueda}"/>
		</h:inputText>
		
		</rich:panel>	
		<br />
		<div style="overflow: auto;height: 300px;">
		<rich:dataGrid id="dg_contactos" value="#{LibretaDirecciones.listaActiva}" columns="1" var="contacto" >
		
		  <rich:panel styleClass="margin:0px;padding:0px;" bodyClass="sin-padding">
               
                <h:panelGrid columns="3" columnClasses="columnaFoto,columnaTexto, columnaContacto" rowClasses="minimizeRowHeight">
                <h:panelGrid >
					<h:graphicImage value="/imgs/contactos/#{Login.usuario}/#{contacto.idContacto}.jpg" height="50" width="50" />
                </h:panelGrid>
                <h:panelGrid columns="2" columnClasses="columnaEtiqueta,columnaCampo">   
                    	<h:outputText value="Nombre" />
                    	<h:outputText  value="#{contacto.nombreContacto}" />
                    	<h:outputText value="Empresa" />
                    	<h:outputText value="#{contacto.empresa}" />
                    	<h:outputText  value="Direccion" />
                    	<h:outputText value="#{contacto.direccion}" />
                    	
                 </h:panelGrid>
                    
                    <h:panelGrid columns="2" columnClasses="columnaCampo,columnaCampo">
                    	<h:outputText value="Movil" />  
	                    <h:outputText value="#{contacto.telefonoMovil}" />
	                   
	                    <h:outputText value="Fijo" />  
	                    <h:outputText  value="#{contacto.telefonoFijo}" />
	                  	 <h:outputText value="Mail" />  
	                    <h:outputText value="#{contacto.email}" />
	                    
                    </h:panelGrid>
				</h:panelGrid>
            </rich:panel>
		
		</rich:dataGrid>
		</div>
	</ui:composition>
</html>